<template>
	<view class="content">
		<!-- <view class="chang-time">
			<view class="c-t-o" v-if="ctany != 1" @click="chang_dang(1)">
				周期内总业绩排名
			</view>
			<view class="c-t-o c-t-oo" v-if="ctany == 1" >
				周期内总业绩排名
			</view>
			<view class="c-t-o" v-if="ctany != 2" @click="chang_dang(2)">
				周期内总加钟金额排名
			</view>
			<view class="c-t-o c-t-oo" v-if="ctany == 2" >
				周期内总加钟金额排名
			</view>
		
			
		</view> -->
		<view class="rech-hd" >
			<view class="riqi">
				当前等级{{level}}
			</view>
			<view class="feiyong">
				<view class="fuwufei">
					当期业绩(元)
					<text>{{yeji}}</text>
				</view>
				<view class="fuwufei">
					当前收入(元)
					<text>{{shouru}}</text>
				</view>
				
			</view>
			<view class="jine">
				<view class="zongjine">
					<text>项目收入</text>
					{{shouru}}
				</view>
				<view class="zongjine">
					<text>车费收入</text>
					{{chefei}}
				</view>
				<view class="zongjine">
					<text>加钟率</text>
					{{jzl}}%
				</view>
				<view class="zongjine">
					<text>在线时长</text>
					{{shichang}}h
				</view>
				
			</view>
		<!-- 	<view class="rech-hd-tit">可提现金额</view>
			<view class="rech-hd-con">
				<text>{{money}}</text>
			</view>
			<view class="acc-btn">
				<navigator url="../my/withdraw">提现</navigator>
			</view> -->
		</view>
		
		
		<view class="tech-eva-con">
			
			
			<view class="record-con">
				<view class="head">
					<text>日期</text>
					<text>业绩(元)</text>
					<text>项目(元)</text>
					<text>车费(元)</text>
					<text>订单</text>
					<text>加钟</text>
				</view>
				
				<view class="body" v-for="(item,index) in order_list">
					<text>{{item.add_time_time}}</text>
					<text>{{item.price}}</text>
					<text>{{item.price}}</text>
					<text>{{item.travel_price}}</text>
					<text>{{item.order_num}}</text>
					<text>{{item.jz_num}}</text>
					
				</view>
				
			</view>
		</view>
	</view>
</template>

<script>
	const app = getApp();
	const request = require('../../utils/request');
	export default {
		data() {
			return {
				chefei:0,
				yeji:0,
				shouru:0,
				jzl:0,
				shichang:0,
				order_list:{},
				params:{},
				level:'V1',
			}
		},
		onLoad()
		{
			that.params.page = 1;
			this.load_money_info();
			
		},
		onShow()
		{
			var that = this;
			
			that.load_money_info(); //获取技师余额日志列表
		},
		onPullDownRefresh()
		{
			//console.log('下拉');
			var that = this;
			that.params.page = 1;
			that.load_money_info(); //获取技师余额日志列表
		},
		onReachBottom()
		{
			//console.log('上拉');
			var that = this;
			that.params.page += 1;
			that.load_money_info(true); //获取技师余额日志列表
		},
		methods: {
			chang_dang(type){
				this.params.page = 1;
				this.load_money_info();
				
			},
			/**
			 * 获取技师账户信息
			 */
			load_money_info:function()
			{
				var that = this;
				//网络请求
				request(app.globalData.n_url+'/v1/Tuisong/tongji', 'POST', {page:that.params.page}).then((res) => {
					if(res.data.code == 0)
					{
						console.log(res);
						that.yeji = res.data.data.yeji;
						that.shouru = res.data.data.shouru;
						that.chefei = res.data.data.chefei;
						that.jzl = res.data.data.jzl;
						that.shichang = res.data.data.shichang;
						that.order_list = res.data.data.order_list;
						that.level = res.data.data.level;
					}else
					{
						uni.showToast({
							title:res.data.msg,
							icon:'none'
						});
						app.is_login_check(res.data);
						app.is_techn_check(res.data);
					}
				});
			},
			
		}
	}
</script>

<style lang="scss">
page{
	background-color: $uni-bg-color-grey;
}
.content{
	.chang-time{
		width: 100%;
		height: 60rpx;
		display:flex;
		.c-t-o{
			text-align: center;
			width: 50%;
		}
		.c-t-oo{
			font-size: 36rpx;
			border-top: 8rpx solid $uni-text-color-active;
		}
		
	}
	.acc-pri{
		display: flex;
		background-color: #fff;
		padding:30rpx 0;
		.acc-pri-con{
			flex: 1;
			text-align: center;
			&:first-child{
				border-right: 2rpx solid  $uni-bg-color-grey;
			}
			.acc-pri-num{
				text{
					position: relative;
					font-size: 40rpx;
					&::before{
						position: absolute;
						left:-25rpx;
						bottom:5rpx;
						content: "￥";
						font-size: 24rpx;
					}
				}
			}
			.acc-pri-tit{
				margin-top:10rpx;
				font-size: 28rpx;
				color: $uni-text-color-grey;
			}
		}
	}
	.rech-hd{
		padding: 50rpx 0 50rpx;
		color: #fff;
		text-align: center;
		background-color:$uni-text-color-active;
		background:url('https://h5.hexukeji.com/techn_img/tj_bg.png');
		background-size: 100% 100%;
		background-repeat: no-repeat;
		
		// display: flex;
		border-radius: 30rpx;
		width: 96%;
		margin: 0 auto;
		.riqi{
			position: absolute;
			top: 28rpx;
			font-size: 28rpx;
			left: 42rpx;
		}
		.feiyong{
		   width: 100%;
		   margin-top: 20rpx;
		   text-align: center;
			.fuwufei{
				display: inline-block;
				width: 45%;
				margin-top: 10rpx;
				font-size: 26rpx;
				text{
					display: block;
					font-weight: bold;
					font-size: 60rpx;
				}
				&:last-child{
					margin-top: 20rpx;
				}
			}
		}
		.jine{
			// margin-left: 40rpx;
			margin-top: 34rpx;
			font-size: 46rpx;
			font-weight: bold;
			display: flex;
			.zongjine{
				width: 25%;
				text-align: center;
				font-weight: normal;
				font-size: 26rpx;
				text{
					display: block;
					font-size: 26rpx;
				}
			}
			.tixian{
				margin-top: 20rpx;
				padding: 10rpx 10rpx;
				background-color: white;
				border-radius: 60rpx;
				color: #109A81;
				font-size: 30rpx;
			}
		}
		.acc-btn{
			margin-top: 30rpx;
			navigator{
				display: inline-block;
				padding:10rpx 50rpx;
				border-radius:30rpx;
				font-size: 24rpx;
				background-color:#fff;
				color:$uni-text-color-active;
			}
		}
		.rech-hd-tit{
			font-size: 28rpx;
			margin-bottom: 20rpx;
		}
		.rech-hd-con{
			text{
				font-size:70rpx;
				&::before{
					content: "￥";
					font-size:32rpx;
				}
			}
		}
	}
	.tech-eva-con{
		margin:30rpx 20rpx;
		border-radius:20rpx;
		padding:20rpx 30rpx;
		background-color: #fff;
		.record-con{
			.record-li{
				padding:20rpx 0;
				border-bottom: 2rpx solid  $uni-bg-color-grey;
				&:last-child{
					border-bottom: none;
				}
				.record-li-tp{
					display: flex;
					justify-content: space-between;
					font-size: 28rpx;
					margin-bottom: 5rpx;
				}
				.record-li-bt{
					display: flex;
					justify-content: space-between;
					font-size: 24rpx;
					color: $uni-text-color-grey;
					.record-tp-rt{
						text{
							color: #f00;
						}
					}
				}
			}
			.head{
				display: flex;
				background-color: #E9F9F6;
				padding: 10rpx 0;
				border-radius: 10rpx;
				text{
					width: 20%;
					text-align: center;
					font-size: 22rpx;
					&:first-child{
						width:25%;
					}
				}
				
			}
			.body{
				display: flex;
				padding-top: 10rpx;
				padding-bottom: 10rpx;
				border-bottom: 2rpx solid #E8E8E8;
				text{
					width: 20%;
					text-align: center;
					font-size:22rpx;
					&:first-child{
						width:25%;
					}
				}
			}
		}
		.place-rem-tit{
			font-size: 28rpx;
			margin: 20rpx 0;
			text{
				&:first-child{
					font-weight: bold;
				}
				&:last-child{
					font-size: 24rpx;
					color: $uni-text-color-grey;
				}
			}
		}
	}
}
</style>